<template>

    <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose :title="modalTitle" :width="1500">
        <BasicTable @register="registerTable" :scroll="{ y: 480 }" :rowSelection="rowSelection"></BasicTable>
    </BasicModal>

</template>

<script setup lang="ts">
import { unref, ref, watch, computed } from 'vue';
import { BasicTable, useTable, TableAction } from '/@/components/Table';
import { BasicModal, useModalInner } from '/@/components/Modal';
import { useListPage } from '/@/hooks/system/useListPage';
import { productList } from '../XlCustomerOrde.api';
import { BasicColumn } from '/@/components/Table';
import { defHttp } from '/@/utils/http/axios';
import { FormSchema } from '/@/components/Table';
//价格等级
let customerLevel = ref();
//过滤id
const filterList = ref([]);
//查询条件
const queryParams = ref({});

const modalTitle = ref("123");

//表单赋值
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
    console.log(data);
    //判断是否有过滤数据
    if (data.filterList) {
        filterList.value = data.filterList;
    }
    if (data.modalTitle) {
        modalTitle.value = data.modalTitle;
    }
});



//商品列表数据
//定义表格列
var columns: BasicColumn[] = [
    {
        title: '商品UPC条码',
        align: 'center',
        dataIndex: 'upcCode',
    },
    {
        title: '商品描述',
        align: 'center',
        dataIndex: 'productName',
    },
    {
        title: '商品品牌',
        align: 'center',
        dataIndex: 'brand',
    },
    
    {
        title: '箱规',
        align: 'center',
        dataIndex: 'cartonSpec',
        width: 100,
    },
    {
        title: '产品规格',
        align: 'center',
        dataIndex: 'productSpec',
        width: 100,
    },
    {
        title: '进货单价/元',
        align: 'center',
        dataIndex: 'purchasePrice',
        width: 100,
    },
    {
        title: '单价',
        align: 'center',
        dataIndex: 'l1Price',
        ifShow: customerLevel.value=== '一批',
        width: 100,
    },
    {
        title: '单价',
        align: 'center',
        dataIndex: 'l2Price',
        ifShow: customerLevel.value === '一批', 
        width: 100,
    },
    {
        title: '单价',
        align: 'center',
        dataIndex: 'l3Price',
        ifShow: customerLevel.value === '一批', 
        width: 100,
    },
];
//查询参数
let schemas: FormSchema[] = [
    {
        label: '商品UPC条码',
        field: 'upcCode',
        component: 'JInput', //TODO 范围查询
        colProps: { span: 7 },
    },
    {
        label: '商品描述',
        field: 'productName',
        component: 'JInput', //TODO 范围查询
        colProps: { span: 6 },
    }

];

//注册table数据
const { tableContext } = useListPage({
    tableProps: {
        columns: columns,
        useSearchForm: true,
       api: productList,
        clickToRowSelect: true,
        immediate: false, //是否自动加载
        formConfig: {
            schemas: schemas,
        },
        rowSelection: { type: 'checkbox' }, //是否单选
        // 是否显示序号列
        showIndexColumn: true,
        // 是否显示操作列
        showActionColumn: false,
        //加载前调用
        beforeFetch: (params) => {
            if (filterList.value.length > 0) {
                params.noIds = filterList.value.map((m) => (m.upcCode ? m.upcCode : m.id)).join(',');
            }
            // console.log(params);
            // Object.assign(params, queryParams.value);
            // console.log(params);
            return params;
        },
        //加载后调用
        //afterFetch: afterFetch,
    },
});
const [registerTable, { reload, setProps, getDataSource, getSelectRowKeys, getSelectRows }, { rowSelection, selectedRowKeys, selectedRows }] =
    tableContext;

</script>

<style scoped></style>